<template>
	<view>
		<uni-section title="打卡内容" type="line">
			<uni-card :title="tzym.rwmc" :extra="title">
				<uParse style="word-break:break-all" :content="tzym.rwmx" @preview="preview" @navigate="navigate"/>
			</uni-card>
		</uni-section>
		<button type="primary" class="anjj" v-if="tzym.gzhlj" @click="gocanvas()">公众号链接</button>
		<button type="primary" class="anjj" v-if="tzym.spid" @click="sphGet()">去视频号看看</button>
		<button type="primary" class="anjj" v-if="tzym.dylj" @click="fzdylj()">复制抖音链接</button>
		<uni-section title="图片上传" type="line">
			<uni-file-picker 
				ref="files"
				:sizeType="sizeType"
				v-model="imageValue"  
				file-mediatype="image"
				:image-styles="imageStyles"
				mode="grid"
				file-extname="png,jpg,webp,bmp"
				:limit="6"
				@progress="progress" 
				@success="success" 
				@fail="fail" 
				@select="select"
			/>
			<!-- :auto-upload="false" <button style="margin: 10px;" class="btnaaa" type="primary" v-if="fbbb" @click="upload00">上传</button> -->
			<button style="margin: 10px;" class="btnaaa" type="primary" v-if="imageValue.length>=tzym.imgnumber" :loading="loading" :disabled="bbbb" @click="upload11">提交</button>
		</uni-section>
		<uni-section title="已上传图片" type="line">
			<uni-grid :column="3" :show-border="false" :square="false">
				<uni-grid-item v-for="(item, index) in dynamicList" :index="index" :key="index">
					<image class="imageIon" webp="true" :src="item.url"  mode="scaleToFill" />
				</uni-grid-item>
			</uni-grid>
		</uni-section>
		<page-head title="新媒体"></page-head>
	</view>
</template>


<script>
	var _this;
	var vk = uni.vk;
	import uParse from "@/pages_bd/components/feng-parse/parse.vue"
	//import uParse from '@/pages_bd/uParse/src/wxParse.vue';
	import uniFilePicker from "@/pages_bd/components/uni-file-picker/uni-file-picker";
	import UniCard from "@/pages_bd/components/uni-card/uni-card";
	export default {
		components: {uParse,uniFilePicker,UniCard},
		data() {
			// 页面数据变量
			return {
				wxuser:{},
				opid:'',
				dynamicList:[],
				bbbb: false,
				loading: false,
				fbbb: false,
				fccc:false,
				imageStyles:{
					border:{
						color:"#2F4056"
					}
				},
				imageValue:[],
				sizeType:['compressed'],
				options:{},
				title:'',
				tzym:{
					imgnumber:99
				}
			}
		},
		// 监听 - 页面每次【加载时】执行(如：前进)
		onLoad(options = {}) {
			_this = this;
			vk = uni.vk;
			_this.options = options;
			_this.tzym = uni.getStorageSync('tzym-xs-key');
			//console.log(_this.tzym)
			_this.wxuser.avatar = vk.getVuex('$user.userInfo.avatar');
			_this.wxuser.nickname = vk.getVuex('$user.userInfo.nickname');
			_this.wxuser.last_login_ip = vk.getVuex('$user.userInfo.last_login_ip');
			//_this.wxuser = vk.getVuex('$user.userInfo');
			_this.wxuser.opid = vk.getVuex('$user.userInfo.wx_openid.mp-weixin');
			this.init(options);
			if(_this.tzym.imgs){
				_this.dynamicList = JSON.parse(_this.tzym.imgs);
			}
			//console.log(_this.tzym)
		},
		// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
		onReady(){
			
		},
		// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
		onShow() {
			
		},
		// 监听 - 页面每次【隐藏时】执行(如：返回)
		onHide() {
			
		},
		// 监听 - 点击右上角转发时
		onShareAppMessage(options) {
			
		},
		// 函数
		methods: {
			gocanvas(){
				//vk.navigateTo('/pages_bd/froms/canvas');
				vk.setStorageSync('wxgzh-key',_this.tzym.gzhlj);
				vk.navigateTo('/pages_bd/gsxgj/web-view?data=1');
			},
			fzdylj(){
				if(_this.tzym.dylj){
					uni.setClipboardData({
						data:_this.tzym.dylj,
						success: function () {
							console.log('success');
						}
					});
				}
			},
			sphGet(){
				wx.openChannelsActivity({
				  finderUserName:_this.tzym.sphid,
				  feedId:_this.tzym.spid,
				  success (res) {
					console.log(res)
				  }
				})
			},
			ztsybbbb(){
				this.loading = true
				this.bbbb = true
				setTimeout(() => {
				    //console.log('计时器1 计时三秒');
					this.bbbb = false
					this.loading = false
				}, 5000);
			},
			async upload11(){
				this.ztsybbbb()
				_this.imageValue.forEach(item =>{
					delete item.extname
					delete item.fileType
					delete item.image
					delete item.fileID
					delete item.name
					delete item.size
					delete item.path
					delete item.uuid
					delete item.status
					delete item.cloudPath
				})
				let imagejson = JSON.stringify(_this.imageValue);
				//console.log(imagejson)
				//let wxobj = JSON.stringify(_this.wxuser);
				await vk.callFunction({
				  url: 'client/gsxy/xmtdk/pub/xmtdk-xs-api.updatexmtdkonexs',
				  title:'请求中...',
				  data:{
				    id: _this.tzym._id,
					wxuser:_this.wxuser,
					imgs: imagejson,
					opid:_this.wxuser.opid
				  }
				}).then((data) => {
				  //console.log(data)
				 _this.tzym.rwwczt = data.newInfo.rwwczt
				 vk.redirectTo("/pages_bd/xmt_xs/xmtdk-xs-list")
				}).catch((err) => {
				  
				});
			},
			async upload00(){
				await this.$refs.files.upload()
			},
			select(e){
				//console.log(e)
				this.fbbb = true
			},
			progress(e){
				//console.log(e)
			},
			fail(e){
				//console.log(e)
			},
			success(e){
				uni.showToast({title:"上传完毕,请上传"+_this.tzym.imgnumber+"以上张图片", icon:"none"});
				//console.log(e)
				//this.fccc = true
				//console.log(this.imageValue.length)
			},
			preview(src, e) {
			  // do something
			  // console.log(src)
			  // console.log('==========')
			  // console.log(e)
			},
			navigate(href, e) {
			  // do something
			  // console.log(href)
			  // console.log('==========')
			  // console.log(e)
			},
			// 页面数据初始化函数
			init(options){
				if(_this.tzym.rwwczt == '0'){
					_this.title = '未打卡'
				}else{
					_this.title = '已打卡'
				}
				//vk.reLaunch("/pages_template/uni-id/index/index");
			},
			pageTo(path){
				vk.navigateTo(path);
			}
		},
		// 监听器
		watch:{
			
		},
		// 计算属性
		computed:{
			
		}
	}
</script>
<style lang="scss" scoped>
	.anjj{
		margin: 10px;
	}
	.example-body {
		/* padding: 30upx; */
		background: #fff
	}
	.vvv{
		font-size: 14px;
		line-height: 3.0;
	}
	.imageIon {
		width: 95upx;
		height: 95upx;
	}
	.btnaaa{
		margin-bottom: 20px;
	}
</style>